﻿<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:common="clr-namespace:Indigo.Quibbler.Common"
    mc:Ignorable="d" x:Class="Indigo.Quibbler.Controls.ToolbarControl">

    <UserControl.Resources>
        <LinearGradientBrush x:Key="TextBoxBorder" EndPoint="0,20" StartPoint="0,0" MappingMode="Absolute">
            <GradientStop Color="#ABADB3" Offset="0.05"/>
            <GradientStop Color="#E2E3EA" Offset="0.07"/>
            <GradientStop Color="#E3E9EF" Offset="1"/>
        </LinearGradientBrush>
        <Style x:Key="SearchTextBoxStyle" BasedOn="{x:Null}" TargetType="{x:Type TextBox}">
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
            <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
            <Setter Property="BorderBrush" Value="{StaticResource TextBoxBorder}"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="Padding" Value="1"/>
            <Setter Property="AllowDrop" Value="true"/>
            <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TextBox}">
                        <Border x:Name="Bd" SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                            <ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter Property="Opacity" TargetName="Bd" Value="0.5"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Storyboard x:Key="sbShowFontOptions">
            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.Visibility)">
                <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Visible}"/>
                <DiscreteObjectKeyFrame KeyTime="00:00:00.1000000" Value="{x:Static Visibility.Visible}"/>
                <DiscreteObjectKeyFrame KeyTime="00:00:00.4000000" Value="{x:Static Visibility.Visible}"/>
            </ObjectAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                <SplineDoubleKeyFrame KeyTime="00:00:00.3000000" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="57"/>
                <SplineDoubleKeyFrame KeyTime="00:00:00.4000000" Value="-45"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Key="sbHideFontOptions">
            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.Visibility)">
                <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Visible}"/>
                <DiscreteObjectKeyFrame KeyTime="00:00:00.4000000" Value="{x:Static Visibility.Visible}"/>
                <DiscreteObjectKeyFrame KeyTime="00:00:00.5000000" Value="{x:Static Visibility.Hidden}"/>
            </ObjectAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:00.3000000" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="-45"/>
                <SplineDoubleKeyFrame KeyTime="00:00:00.4000000" Value="57"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>

    </UserControl.Resources>

    <Border  Grid.Column="0" Height="65" BorderThickness="2" CornerRadius="20" VerticalAlignment="Center">
        <Border.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <!--<GradientStop Color="#FF992B2A"/>-->
                <GradientStop Color="#FFC3C3C3" Offset="0.302"/>
                <GradientStop Color="#FFD2D2D2" Offset="0.650"/>
                <GradientStop Color="#FFE5E5E5" Offset="1"/>
            </LinearGradientBrush>
        </Border.Background>
        <Grid x:Name="mainControl" Margin="10,0,0,0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="5"/>
                <ColumnDefinition Width="Auto"/>
                <!-- Share-->
                <ColumnDefinition Width="3*" MaxWidth="24"/>
                <ColumnDefinition Width="1"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="1"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="1"/>
                <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="10*"/>
				 <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="20*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <Canvas Grid.Column="0">
                <common:ImageButton x:Name="btnHome" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/Home.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverHome.png"  ToolTip="Home" Margin="0,5,0,5" Height="96" Canvas.Top="-21" />
            </Canvas>
            <Canvas Grid.Column="1">
                <common:ImageButton x:Name="btnDelete" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/IconDelete.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverIconDelete.png"   RenderTransformOrigin="0.5,0.5" ToolTip="Coming soon: Delete Subscription" Visibility="Collapsed"/>
            </Canvas>
            <Canvas Grid.Column="2" Margin="0">
                <common:ImageButton x:Name="btnShare" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/Share.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverShare.png"   RenderTransformOrigin="0.5,0.5" ToolTip="Coming soon: Live Share" Visibility="Collapsed"/>
            </Canvas>

            <Rectangle Grid.Column="4" Grid.Row="0" Fill="#FFDADADA" Height="50" Margin="0" Width="1"  />

            <Canvas Grid.Column="6">
                <common:ImageButton x:Name="btnTile" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/Tile.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverTile.png"  ToolTip="Tile view" Canvas.Top="12" Height="36" />
            </Canvas>
            <Canvas Grid.Column="7">
                <common:ImageButton x:Name="btnCarousel" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/Carousel.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverCarousel.png"  ToolTip="Coverflow view" Canvas.Top="14" Height="36" HorizontalAlignment="Center" VerticalAlignment="Center" Canvas.Left="-10" />
            </Canvas>
            <Canvas Grid.Column="10" Grid.ColumnSpan="2">
                <common:ImageButton x:Name="btnTile3D" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/3DGrid.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverGrid.png"  ToolTip="Tile3D view" Canvas.Top="13" Height="36" Canvas.Left="5" />
            </Canvas>

            <Rectangle Grid.Column="13" Grid.Row="0" Fill="#FFDADADA" Height="50" HorizontalAlignment="Right" Width="1" />

            <Canvas Grid.Column="14">
                <common:ImageButton x:Name="btnSpider" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/Spider.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverSpider.png" ToolTip="Toggle Spider view" Canvas.Top="1" Height="61" Width="88" Canvas.Left="-9" />
            </Canvas>

            <Rectangle Grid.Column="15" Grid.Row="0" Fill="#FFDADADA" Height="50" />

            <Canvas Grid.Column="16">
                <Grid x:Name="grid" RenderTransformOrigin="0.5,0.5" Opacity="0" Margin="20,-32,2,0" Visibility="Hidden" >
                    <Grid.RenderTransform>
                        <TransformGroup>
                            <ScaleTransform/>
                            <SkewTransform/>
                            <RotateTransform/>
                            <TranslateTransform Y="34"/>
                        </TransformGroup>
                    </Grid.RenderTransform>
                    <Grid.Background>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FFC3C3C3" Offset="0.302"/>
                            <GradientStop Color="#FFD2D2D2" Offset="0.650"/>
                            <GradientStop Color="#FFE5E5E5" Offset="1"/>
                            <!--<GradientStop Color="#4B000000" Offset="0.658"/>
                            <GradientStop Color="#19FFFFFF" Offset="1"/>
                            <GradientStop Color="#D8000000" Offset="0.217"/>-->
                        </LinearGradientBrush>
                    </Grid.Background>
                    <StackPanel Width="70">
                        <Label x:Name="lblLarge" Content="Large" Foreground="Black" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="12" Cursor="Hand"/>
                        <Label x:Name="lblMedium" HorizontalAlignment="Center" VerticalAlignment="Center" Content="Medium" Foreground="Black" FontSize="11" Cursor="Hand" Margin="0,0,0,0"/>
                        <Label x:Name="lblSmall" HorizontalAlignment="Center" VerticalAlignment="Center" Content="Small" Foreground="Black" FontSize="10" Cursor="Hand" Margin="0,0,0,0"/>
                    </StackPanel>
                </Grid>
                <common:ImageButton x:Name="btnZoom" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/IconFont.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverIconFont.png"   RenderTransformOrigin="0.5,0.5" ToolTip="Zoom Level" Canvas.Left="9" Canvas.Top="-3" Height="70" />
            </Canvas>
            <Canvas Grid.Column="17">
                <common:ImageButton x:Name="btnScribble" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/Scribble.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverScribble.png"  ToolTip="Scribble" Canvas.Left="7.5" Canvas.Top="-4.5"/>
            </Canvas>
            <Canvas Grid.Column="18">
                <common:ImageButton x:Name="btnComment" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/Comment.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverComment.png"   RenderTransformOrigin="0.5,0.5" ToolTip="Comment" Canvas.Top="-16" Canvas.Left="6" Height="97" />
            </Canvas>
            <Canvas Grid.Column="19">
                <common:ImageButton x:Name="btnReadAloud" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/Read.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverRead.png" RenderTransformOrigin="0.5,0.5" ToolTip="Read Aloud" Canvas.Left="7.5" Canvas.Top="-17" Height="96" />
            </Canvas>
            <Canvas Grid.Column="21">
                <common:ImageButton x:Name="btnSearch" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/Search.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverSearch.png" ToolTip="Search" Canvas.Top="-38" Canvas.Left="-25" Height="133" Width="147" />
            </Canvas>
			<Canvas Grid.Column="20">
                <common:ImageButton x:Name="btnFeedback" ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/Feedback.png" HoverImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/HoverFeedback.png" RenderTransformOrigin="0.5,0.5" ToolTip="Add Feedback" Canvas.Left="7.5" Canvas.Top="-17" />
            </Canvas>
            <TextBox Grid.Column="22" Height="22" x:Name="txtSearch" AcceptsReturn="False" AcceptsTab="False" VerticalAlignment="Bottom" SpellCheck.IsEnabled="True" Text="SEARCH" BorderBrush="#FF514F4F" Foreground="#FF8C8C8C" BorderThickness="2" TextAlignment="Center" Background="Transparent" Style="{DynamicResource SearchTextBoxStyle}" MinWidth="100" Margin="0,0,15,10"/>
            <Button Grid.Column="22" x:Name="btnPinBar" Margin="0,5,10,0" HorizontalAlignment="Right" Width="15" Height="15" VerticalAlignment="Top" ToolTip="Unpin" Cursor="Hand">
                <Button.Template>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Image Stretch="Fill" x:Name="imageControlAutoHide" Source="pack://application:,,/Quibbler - Universal News Reader;component/Images/IconAutoHideDisabled.png"/>
                    </ControlTemplate>
                </Button.Template>
            </Button>
        </Grid>
    </Border>
</UserControl>
